<template>
  <view class="navBarMain" :style="{paddingTop: iStatusBarHeight + 'px', paddingRight: menuButtonSize.width + 20 + 'px'}">
    <view class="navBar">
      <view class="back">
        <uni-icons type="back" size="20"></uni-icons>
      </view>      
      <view class="leftButton">
        <slot></slot>
      </view>
    </view>
  </view>
</template>

<script>
  export default {
    name:"loginNavBar",
    data() {
      return {
        iStatusBarHeight: uni.getSystemInfoSync().statusBarHeight,
        menuButtonSize: {
          width: 0
        }
      };
    },
    mounted() {
      this.menuButtonSize = uni.getMenuButtonBoundingClientRect()
    }
  }
</script>

<style lang="scss" scoped>
.navBarMain {
  padding-left: 20rpx;
  border-bottom: 1rpx solid #F0F1F4;
}
.navBar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 80rpx;
  padding: 10rpx 0;
}
</style>